import { Button, Space } from '@kedacom/react-next'
import { StyledWrap } from './style'
import { useLocalStorageState } from 'ahooks'
import { t } from 'i18next'
import { RRDB } from '@/plugins/log'
import dayjs from '@/plugins/dayjs'
import { saveAs } from '@/utils'

export const Experimental = () => {
	const [behavior, setBehavior] = useLocalStorageState<string>('__EXPERIMENTAL_behavior__', {
		defaultValue: 'off',
	})

	const handleDownload = () => {
		RRDB.readAll().then(function (res: any) {
			var content = JSON.stringify(res)
			var blob = new Blob([content], { type: 'text/plain;charset=utf-8' })
			saveAs(blob, dayjs().format('YYYY/MM/DD/hh/mm') + '.json')
		})
	}

	return (
		<StyledWrap id="experimental" style={{ display: 'none' }}>
			<h3 className="title">{t('实验性功能')}</h3>
			<Space>
				<Button
					onClick={() => {
						if (behavior === 'on') {
							setBehavior('off')
						} else {
							setBehavior('on')
						}
					}}
				>
					{behavior === 'on' ? t('关闭行为记录') : t('开启行为记录')}
				</Button>
				<Button onClick={handleDownload}>{t('下载行为记录')}</Button>
			</Space>
		</StyledWrap>
	)
}
